<%@ page language="java" contentType="text/html; charset=UTF-8"  pageEncoding="UTF-8"%>
<%@include file="/WEB-INF/view/include/taglib.jsp"%>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
	
	<title>房源收藏</title>
	<link href="${project}/ds/css/buttons.css" rel="stylesheet" />
    <link href="${project}/ds/lib/font-awesome-4.7.0/css/font-awesome.css" rel="stylesheet" />
    <link rel="stylesheet" href="${project}/ds/css/space.css" />
    <link href="${project}/ds/lib/layui/css/layui.css" rel="stylesheet" />
    <link href="${project}/ds/css/roomStyle.css" rel="stylesheet" />
</head>
<body>
    <style type="text/css">
        .count_text {
            height: 50%;
            font-size: 16px;
            -webkit-transform: scale(0.8);
        }

        .count_value {
            height: 50%;
            letter-spacing: 0px;
            font-size: 6px;
            -webkit-transform: scale(0.8);
        }
    </style>
    <div style="position: fixed; top: 0; left: 0; right: 240px; text-align: center; bottom: 0; overflow: auto;">
        <div id="allroomdiv">
            <div id="bansdiv" style="margin: 10px 0 0 0;"></div>
        </div>
    </div>
    <div style="position: fixed; top: 0; right: 0; width: 240px; bottom: 0;">
        <div class="message" style="width: 15%; min-width: 240px;">
            <table bordercolor="black" style="width: 100%;">
                <tr>
                    <th>
                        <div align="right">楼栋：</div>
                    </th>
                    <td>
                        <span class="dbanname roomSpan"></span>
                    </td>
                </tr>
                <tr>
                    <th>
                        <div align="right">单元：</div>
                    </th>
                    <td>
                        <span class="dunit roomSpan"></span>
                    </td>
                </tr>
                <tr>
                    <th>
                        <div align="right">室号：</div>
                    </th>
                    <td>
                        <span class="droomno roomSpan"></span>
                    </td>
                </tr>
                <tr>
                    <th>
                        <div align="right">面积：</div>
                    </th>
                    <td>
                        <span class="dfloorarea roomSpan"></span>
                    </td>
                </tr>
                <tr>
                    <th>
                        <div align="right">户型：</div>
                    </th>
                    <td>
                        <span class="dhousemodel roomSpan"></span>
                    </td>
                </tr>
                <tr>
                    <th>
                        <div align="right">类型：</div>
                    </th>
                    <td>
                        <span class="droomtype roomSpan"></span>
                    </td>
                </tr>
                <tr>
                    <th>
                        <div align="right">单价：</div>
                    </th>
                    <td>
                        <span class="dprice roomSpan"></span>
                    </td>
                </tr>
                <tr>
                    <th>
                        <div align="right">总价：</div>
                    </th>
                    <td>
                        <span class="dtotle roomSpan"></span>
                    </td>
                </tr>
                <tr>
                    <th>
                        <div align="right">收藏：</div>
                    </th>
                    <td>
                        <span class="dcollectioncount roomSpan">
                        
                        </span>
                    </td>
                </tr>
            </table>
            <div class="MonitorButton">
                <input type="button" value="清除全部收藏记录" onclick="ClearAllCollection()" style="width:140px" />
            </div>
            <div class="MonitorButton">
                <input type="button" value="清除假收藏记录" onclick="ClearJiaCollection()" style="width:140px" />
            </div>
            <div class="MonitorButton">
                <input type="button" value="导出收藏列表" onclick="GetExcel()" style="width:140px" />
            </div>
        </div>
    </div>
    <div id="collectiondiv" style="display:none;height:36px; text-align: center; padding:10px;background:white">
        <input type="button" value="-"  style="float:left;width:40px;font-size: 28px;" onclick="Reduce()" />
        <input id="Count" type="number" value="0" style="width:60px;font-size: 28px;float:left" />
        <input type="button" value="+"  style="float:left;width:40px;font-size: 28px;" onclick="Add()" />
        <input type="button" value="确定"  class="layui-btn" style="float:left;margin-left:5px;" onclick="Submit()"/>
        <input type="button" value="取消"  class="layui-btn" style="float:left;margin-left:5px;" onclick="layerclose()"/>
    </div>
<script src="${project}/ds/lib/jquery/jquery-3.1.1.min.js" type="text/javascript"></script>
<script src="${project}/ds/js/XHD.js" type="text/javascript"></script>
<%-- <script src="${project}/ds/js/room/room1.0.js" type="text/javascript"></script>  --%>
<script src="${project}/ds/lib/layui/layui.js" type="text/javascript"></script>
<%-- <script src="${project}/ds/js/room/deal.js" type="text/javascript"></script>
<script src="${project}/ds/js/js/ws.js" type="text/javascript"></script> --%>
<script src="${project}/ds/js/layeralert.js" type="text/javascript"></script>
<%-- <script src="${project}/ds/js/room/command.js" type="text/javascript"></script> --%>
<script type="text/javascript">
    var user;
    var usertype = 4;
    var InitType = "collection";
    var layerindex = undefined;
    var layer;
    var dbclicktype = 1;
    var dbclickvalue = "";
    var BusType = 1;
    layui.use(['layer'],
        function() {
            layer = layui.layer;
        });
    $(function() {
    	$("#allroomdiv").load("/collectionMonitor/loudongData");
    	setInterval("checkRoomState()", 2000);
    });

    function checkRoomState() {
  	  $.ajax({
            url: "/roomMonitor/checkRoomState",
            type: "post",
            async: true,
            dataType: "json",
            success: function(data) {
                var json=data.msg;  
                UpdateCollectionCountAll(json);
            }
        });	       
	}
    
  //根据收藏变色,查看真实收藏
	function UpdateCollectionCountAll(json){
		  var dc=0;
		  json.forEach((t, i) => {
			  dc = $("#"+t.D_ID).attr("dc");
			  $("#"+t.D_ID).removeClass("collection"+dc);
              if(t.D_CollectionCount ==0){
                 $("#"+t.D_ID).addClass("collection"+t.E_CollectionCount);
              }else if(t.D_CollectionCount>0 || t.D_CollectionCount<10){
            	  $("#"+t.D_ID).addClass("collection"+t.E_CollectionCount);
              }else {
            	  $("#"+t.D_ID).addClass("collection10");
              }
              $("#"+t.D_ID).attr("dc",t.E_CollectionCount);
         });
	}

    function ClearAllCollection() {
        layer.open({
            title: "确定清除所有房间的收藏记录？",
            type: 1,
            btn: ['确定', '取消'],
            btnAlign: "c",
            shadeClose: false,
            closeBtn: 0,
            yes: function (index) {
            	ClearAll(index);
            },
            btn2: function (index) {
                layer.close(index);
            }
        });
    }
    function ClearAll(index){
    	 $.ajax({
             url: "/collectionMonitor/ClearAllCollection",
             type: "post",
             async: true,
             dataType: "json",
             success: function(data) {
                 if(data.result==="true"){
                	 clearRoomCollection();
                	 layer.msg("清除成功!");
                	 layer.close(index);
                 }
             }
         });
    }
    function clearRoomCollection(){
    	$(".roomDiv").each(function(){
    		  dc = $(this).attr("dc");
			  $(this).removeClass("collection"+dc);
    	});
    }
    //删除假收藏
    function ClearJiaCollection() {
        layer.open({
            title: "确定清除所有房间的收藏记录？",
            type: 1,
            btn: ['确定', '取消'],
            btnAlign: "c",
            shadeClose: false,
            closeBtn: 0,
            yes: function (index) {
            	ClearJia(index);
            },
            btn2: function (index) {
                layer.close(index);
            }
        });
    }
    function ClearJia(index){
    	 $.ajax({
             url: "/collectionMonitor/ClearJiaCollection",
             type: "post",
             async: true,
             dataType: "json",
             success: function(data) {
                 if(data.result==="true"){ 
                	 clearRoomCollection();              	
                	 layer.msg("清除成功!");
                	 layer.close(index);
                 }
             }
         });
    }
   
    function layeropen(obj, type) {
        var offset = $(obj).offset();
        layerindex = layer.open({
            type: 1,
            content: $("#collectiondiv"),
            skin: 'layui-layer-nobg',
            closeBtn: false,
            shade: [0.5, "#000"],
            shadeClose: false,
            title: type + "收藏人数修改",
            //title: false,
            move: false,
            resize: false,
            offset: [(offset.top + 40), offset.left],
            end: function () {
                $("#sallerdiv").hide();
            }
        });
    }

    function layerclose() {
        layer.close(layerindex);
        $("#Count").val(0);
        //UpdateCollectionCount()
    }

    function Reduce() {
    	if($("#Count").val()==0){
    		return;
    	}
        $("#Count").val($("#Count").val() - 1);
    }

    function Add() {
        $("#Count").val((parseInt($("#Count").val()) + 1));
    }

 

  
	
	//下载收藏报表
    function GetExcel() {
    	 window.location="/collectionMonitor/downloadRoomCollection";
    }
	
	//保存事件
    function Submit() {
        var value = dbclickvalue;
        console.log(value);
        var count = $("#Count").val();
        console.log("count="+count);
       
            if (dbclicktype == 1) {//房源点击
            	collectionUpdate("1",value,count)
            }
            else if(dbclicktype == 2){//楼栋点击
                collectionUpdate("2",value,count)
            }else if(dbclicktype == 3){//单元点击
            	collectionUpdate("3",value,count)
            }else{//
            	collectionUpdate("4",value,count)
            }
       
        layerclose(layerindex);
        $("#Count").val(0);
    }
	function collectionUpdate(type,value,count){	 
		  $.ajax({
	            url: "/collectionMonitor/collectionUpdate",
	            type: "post",
	            async: true,
	            data: {type:type,id:value,count:count},
	            dataType: "json",
	            success: function(data) {
	            	if(data.result==="true"){
	            		//UpdateCollectionCount(value, count);
	            		//getMessage(value);
	            		console.log(data.msg);
	            		//UpdateCollectionCountAll(data.msg);
	            		//layerclose();
	            	}else{
	            		console.log(data.msg);
	            	}
	            }
	        });
	}
	
	
	//根据收藏数变更颜色
    function UpdateCollectionCount(id, count) {
        $("div#" + id + " div.count_value").html(count);
        var cssclass;
        if (count <= 0)
        {
            cssclass = noneClass;
        }
        else if (count <= 10)
        {
            cssclass = "collection" + count;
        }
        else if (count > 10)
        {
            cssclass = "collection10";
        }
        var cla = $("div#" + id).attr("class");
        $("div#" + id).attr("class", removeClass(cla));
        $("div#" + id).addClass(cssclass);
    }

    function removeClass(css) {
        if (/collection/g.test(css)) {
            css = css.replace(/[\s]collection\w*[\s]?/g, " ");
        }
        console.log(css);
        return css;
    }
    
  //楼栋选择事件
    function selectBan(obj) {
        $(obj).addClass("roomgold").removeClass("button-flat-primary");
        $(obj).siblings().removeClass('roomgold');
        //点击显示楼栋房间事件
         $(".banforroom").each(function () {
                $(this).hide();
            });
          var banid = $(obj).attr("banid");
        //var banname = $(obj).html();
        //$("#banid").val(banid);
        $("#" + banid).show();
        $(".roomDiv").removeClass("roomChecked");
       // $("#baninfo").html(window.housesName + "·" + $(obj).html());     
    }
  
    $(document).on("click", ".roomUnitDiv ,.roomDivUnit", function (e) {
    	 $(".roomDiv").removeClass("roomChecked");
    })
    
   
    //楼栋双击
    $(document).on("dblclick",".bandiv",
            function () {
		    	 dbclicktype = 2;
		         dbclickvalue = $(this).html();
		         dbClickGetValue("2",dbclickvalue);
		         layeropen(this, "楼栋");
            }
        );
    //单元双击
    $(document).on("dblclick",".roomUnitDiv",
            function () {
		    	 dbclicktype = 3;
		         dbclickvalue = $(this).attr("pname");
		         console.log(dbclickvalue);
		         dbClickGetValue("3",dbclickvalue);
		         layeropen(this, "单元");
            }
        );
    //套型双击
    $(document).on("dblclick",".roomDivUnit",
            function () {
		    	 dbclicktype = 4;
		         dbclickvalue = $(this).attr("pname");
		         console.log(dbclickvalue);
		         dbClickGetValue("4",dbclickvalue);
		         layeropen(this, "套型");
            }
        );
    //房源双击
    var TimeFn = null;
     $(document).on("dblclick",".roomDiv",
            function () {
    		  	clearTimeout(TimeFn);
    	        dbclicktype = 1;
    	        dbclickvalue = $(".roomChecked")[0].id;
    	        dbClickGetValue("1",dbclickvalue)
    	        layeropen(this, "房间");
            }
      );
     //双击获得收藏数
     function dbClickGetValue(type,key){
    	  $.ajax({
              url: "/collectionMonitor/dbClickGetValue",
              type: "post",
              async: false,
              data: { type: type, key: key }, 
              dataType: "json",
              success: function(data) {
                  $("#Count").val(data.msg);
              }
          });
     }
     //房源单击事件
     var roomid;
     $(document).on("click", ".roomDiv", function (e) {
    	 clearTimeout(TimeFn);
    	 roomid = $(this).attr("id");
         $("#roomid").val(roomid);
         $(this).addClass("roomChecked");
         $(".roomDiv").not(this).removeClass("roomChecked");
         
         	TimeFn = setTimeout(function(){
				getMessage(roomid);
		    },300);
     });
     function getMessage(id){
    	 $.ajax({
             url: "/collectionMonitor/getRoomMsg",
             type: "post",
             data: { id: id},
             dataType: "json",
             success: function (data) {
            	 console.log(data);
            	 ShowMessage(data)
             }
         });
     }
     function ShowMessage(data) {
    	    var room = data;
    	    $(".dbanname").html(room.D_BanName);
    	    $(".dunit").html(room.D_Unit);
    	    $(".dunitname").html(room.D_position);
    	    $(".droomno").html(room.D_RoomNo);
    	    $(".droomcard").html(room.D_RoomCard);
    	    $(".dfloorarea").html(room.D_FloorArea);
    	    $(".dinnerarea").html(room.D_InnerArea);
    	    $(".dassessmentarea").html(room.D_AssessmentArea);
    	    $(".dhousemodel").html(room.D_HouseModel);
    	    $(".droomtype").html(room.D_RoomType);
    	    $(".dprice").html(room.D_Price);
    	    $(".dtotle").html(room.D_Total);
    	    $(".ddiscountprice").html(room.D_discountPrice);
    	    $(".ddiscounttotle").html(room.D_discountTotal);
    	    $(".dname").html(room.Name);
    	    $(".dcardno").html(room.CardNo);
    	    $(".dtel").html(room.Tel);
    	    $(".dcollectioncount").html(room.D_CollectionCount + "|" + room.E_CollectionCount);
    	}
</script>
</body>
</html>